html,
body {
    height: 100%;
    width: 100%;
}

#details {
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;

    a {
        text-decoration: none;
    }

    header {
        position: relative;
        display: flex;
        flex-direction: row;
        justify-content: left;
        height: 1.04rem;
        line-height: 1.04rem;
        border-bottom: .026667rem solid #e5e5e5;

        .left {
            height: 1.04rem;
            line-height: 1.04rem;
            position: absolute;
            top: 0;
            left: 0;
            padding-left: .333333rem;
            width: 1.6rem;
            font-size: .48rem;
        }

        i {
            font-size: .533333rem;
            font-weight: bold;
        }

        h1 {
            width: 100%;
            font-size: .4rem;
            text-align: center;
            overflow: hidden;
            padding: 0 .266667rem 0 2rem;
        }
    }

    main {
        flex: 1;
        overflow-y: scroll;
        background: #f6f6f6;
        padding-bottom: 1.333333rem;

        img {
            width: 100%;
            height: 100%;
        }

        .goodimg {
            margin-top: .293333rem;
            height: 10rem;
            border-bottom: .026667rem solid #e0e0e0;
        }

        .goodinfo {
            padding: .266667rem 0 .906667rem;
            border-bottom: .013333rem solid #efefef;

            .title {
                padding: .266667rem .533333rem;
                text-align: center;
                font-size: .4rem;
                line-height: .64rem;
                color: #333;
            }

            .price {
                color: #333;
                font-size: .4rem;
                font-weight: bold;
                text-align: center;
            }
        }

        .freight {
            background: #fff;
            height: 3.186667rem;
            padding: 0 .266667rem;
            border-top: .013333rem solid #e0e0e0;
            border-bottom: .013333rem solid #e0e0e0;

            p:nth-of-type(1) {
                height: 1.04rem;
                line-height: 1.04rem;
                font-size: .373333rem;
                border-top: .013333rem solid #e0e0e0;
                border-bottom: .013333rem solid #efefef;
            }

            ul {
                height: 1.093333rem;
                line-height: 1.093333rem;
                display: flex;
                flex-direction: row;
                border-top: .013333rem solid #e0e0e0;
                border-bottom: .013333rem solid #efefef;

                li {
                    flex: 1;
                    padding-left: .4rem;
                    background: url(../images/d.png) no-repeat left center;
                    background-size: .4rem;
                    color: #666;
                    font-size: .32rem;
                }
            }

            p:nth-of-type(2) {
                height: .986667rem;
                line-height: .986667rem;
                font-size: .346667rem;
                border-top: .013333rem solid #e0e0e0;
                border-bottom: .013333rem solid #efefef;
                color: #666;
            }
        }

        .gooddes {
            margin-top: .4rem;
            background: #fff;
            padding: .266667rem 0;
        }

        .addcar {
            width: 100%;
            background: #fff;
            height: 1.52rem;
            border-top: .026667rem solid #ddd;
            position: fixed;
            bottom: 1.333333rem;

            ul {
                display: flex;
                flex-direction: row;

                li {
                    flex: 1;
                    font-size: .4rem;
                    text-align: center;
                    line-height: 1.52rem;
                }
            }

            .add,
            .buy {
                border: 1px solid #4a4a4a;
                border-radius: .133333rem;
                padding: .266667rem 1.066667rem;
                color: #1d1d1d;
            }

            .buy {
                background: #1d1d1d;
                color: #fff;
            }
        }
    }

    footer {
        height: 1.333333rem;
        background: #000;
    }

}